<!doctype html>
<html>

<head>
    <meta charset="utf-8">
    <meta name="viewport" content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,initial-scale=1.0,width=device-width"/>
    <meta name="format-detection" content="telephone=no,email=no,date=no,address=no">
    <title>APP</title>
    <link rel="stylesheet" type="text/css" href="../assets/css/api.css"/>
    <link rel="stylesheet" type="text/css" href="../assets/css/common.css"/>
    <link rel="stylesheet" type="text/css" href="../assets/css/loaders.css"/>
</head>

<body>
<div id="wrap">
    <div id='header'>
        <div class="back" tapmode="back-active" onclick="jsFn.backClick()">返回</div>
        <h1 id="title"></h1>
        <div class="adpt"></div>
    </div>

    <div id="main">
        <div id="loading">
            <div class="loader-inner ball-clip-rotate">
                <div></div>
            </div>
        </div>
    </div>

    <div id="footer"></div>
</div>
</body>
<script type="text/javascript" src="../assets/js/api.js"></script>
<script type="text/javascript" src="../assets/js/common.js"></script>
<script type="text/javascript">

    apiready = function () {


        var header = $api.byId('header');
        var footer = $api.byId('footer');
        var headerH = $api.fixStatusBar(header);
        var footerH = $api.fixTabBar(footer);

        var pageParam = api.pageParam || {};

        // 设置标题
        var title = $api.byId('title');
        title.innerHTML = pageParam.title || '';

        // 处理url
        var url = pageParam.url || '../html/404.html';
        if (!url.startsWith('http') && !url.startsWith('../html')) {
            url = jsFn.resHost() + url;
        }

        var bounces = !pageParam.noBounces;

        var frameOption = {
            name        : jsFn.frameName,
            url         : url,
            bounces     : bounces,
            useWKWebView: true,
            rect        : {marginTop: headerH, marginBottom: footerH, w: 'auto'},
            headers     : {
                'X-Token': jsFn.getToken()
            }
        };

        var headers = pageParam.header || {};
        Object.keys(headers).forEach(function (key) {
            frameOption.headers[key] = headers[key];
        });

        api.openFrame(frameOption);

        api.setFrameClient({frameName: jsFn.frameName}, function (ret, err) {
            // state:加载状态，数字类型，取值范围：0-开始加载；1-加载进度发生变化；2-结束加载；3-title发生变化；4-url发生变化
            if (ret.state === 2) {
                setTimeout(function () {
                    $api.remove($api.byId('loading'));
                }, 1500);
            }
        });

    };

</script>

</html>
